<template>
  <div>
    <div style="display: flex; justify-content: flex-end; margin: 10px">
      <a-button type="primary" @click="back(null)">返回上一级</a-button>
    </div>
    <div ref="editor"></div>
    <div
      style="
        display: flex;
        justify-content: center;
        align-items: center;
        margin-top: 20px;
      "
    >
      <a-button @click="save()" type="primary"> 保存 </a-button>
    </div>
  </div>
</template>
<script>
import E from "wangeditor-antd";
import api from "@/api/api.js";
import UploadImg from "../../components/uploadImg.vue";
import { quillEditor } from "vue-quill-editor";
import { quillRedefine } from "vue-quill-editor-upload";
import "quill/dist/quill.core.css";
import "quill/dist/quill.snow.css";
import "quill/dist/quill.bubble.css";

export default {
  name: "editor",
  props: ["get-full-text", "content"], //回调方法
  components: {
    UploadImg,
  },
  mounted() {
    var editor = new E(this.$refs.editor);
    editor.customConfig.customUploadImg = function (files, insert) {
      var formData = new FormData();
      formData.append("files", files[0]);
      api.tinymcePic(formData).then((res) => {
        if ((res.code = 200)) {
          var url = res.result[0];
          insert(url);
        }
      });
    };
    this.editor = editor;
    editor.create();
  },
  data() {
    return {
      id: "",
      param: this.$route.query.param,
      type: this.$route.query.type,
      answerId: null,
    };
  },
  methods: {
    back() {
      this.$router.push("about");
    },
    getPlan() {
      api
        .getAnswerList({
          questionId: this.param,
        })
        .then((res) => {
          console.log(res);
          if (res.code == 200) {
            this.editor.txt.html(res.result.content);
            this.answerId = res.result.answerId;
          }
        });
    },
    save() {
      console.info(this.answerId);
      let params = {
        questionId: this.param,
        content: this.editor.txt.html(),
        answerId : this.answerId,
      };
      // if (this.answerId != null) {
      //   params.answerId = this.answerId;
      // }
      api.saveAnswer(params).then((res) => {
        if (res.code == 200) {
          this.$message.success("更新成功");
          this.getPlan();
        }
      });
    },
  },
  created() {
    this.getPlan();
  },
};
</script>

<style lang="scss" scoped="" type="text/css">
.editable-row-operations a {
  margin-right: 8px;
}
.top-btn {
  padding: 10px;
}
.code-img {
  display: block;
  width: 150px;
}
</style>
